<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <input class="ipt" type="text" placeholder="请输入信息">
    <pre class="cat"></pre>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.1/jquery.js"></script>
    <script>
        var data = null;
        var time = null;
        var input = document.getElementsByClassName("ipt")[0];
        var cat = document.querySelector(".cat");
        cat.innerHTML = "";
        input.oninput = function () {
            clearTimeout(time);
            var self = this;
            cat.innerHTML = "";
            time = setTimeout(function () {
                intercept = false;
                var xhr = new XMLHttpRequest();
                xhr.onreadystatechange = function (data) {
                    if (this.status == 200 && this.readyState == 4) {
                        data = JSON.parse(this.responseText);
                        console.log(data);
                        cat.innerHTML = "";
                        [].forEach.call(data.result.list, function (data) {
                            var item = document.createElement("div");
                            console.log(data);
                            item.innerHTML = `${data.r.an}:${data.r.n}:${data.r.tips}`;
                            cat.appendChild(item);
                        });
                        return;
                    }
                    cat.innerHTML = "搜索错误";
                }
                xhr.open("get", `https://apis.netstart.cn/douguo/recipe/search?keyword=${self.value}`, true);
                xhr.send();
            }, 2000);
        }
        jQuery.ajax({
            type: "get",
            url: "http://api.tianapi.com/ncov/index",
            data: {
                key: "ed7404f6f4d01b7b3f4432e45eca3a81"
            },
            success: function (data) {
                console.log(data);
            }
        });
        jQuery.get("http://api.tianapi.com/ncov/index", {
            key: "ed7404f6f4d01b7b3f4432e45eca3a81"
        }, function (data) {
            console.log(data, "get");
        });
        jQuery.post("http://api.tianapi.com/ncov/index", {
            key: "ed7404f6f4d01b7b3f4432e45eca3a81"
        }, function (data) {
            console.log(data, "post");
        })
    </script>
</body>

</html>